/*
 * @version: 1.0
 * @author: xul0038@qq.com
 * https://gitee.com/xul/autocompleteX
 */
layui.define([ 'jquery', 'layer' ], function(exports) {
    var $ = layui.jquery, layer = layui.layer,
        // MOD_NAME
        MOD_NAME = 'inputTags',
        // interface
        autocompleteX = {
            config : {
                elem : '',
                width : null,
                data : []
            },
            set : function(options) {
                var that = this;
                that.config = $.extend({}, that.config, options);
                return that;
            },
            on : function(events, callback) {
                // return layui.onevent.call(this, MOD_NAME, events, callback)
            }
        },
        // instance
        thisAutocompleteX = function() {
            var that = this, options = that.config;
            return {
                config : options
            }
        },
        // constructor
        Class = function(options) {
            var that = this;
            that.config = $.extend({}, that.config, autocompleteX.config, options);
            that.render();
        };

    Class.prototype.render = function() {
        var that = this
            , options = that.config
            , data = options.data
            , $elem = $(options.elem)
            , $elemAcx = $elem.parent().parent();
        if ($elem.length == 0) {
            return false;
        }

        // 创建选项
        $elem.wrap('<div class="layui-autocompleteX"><div class="layui-form-select"></div></div>');
        var html = '<dl class="layui-anim layui-anim-upbit">';
        for (var i = 0; i < data.length; i++) {
            html += '<dd>' + data[i] + '</dd>';
        }
        html += '</dl>';
        $elem.after(html);

        if (/^\d+$/.test(options.width)) {
            $elemAcx.css('width', options.width + 'px');
        }

        that.events();
    };
    Class.prototype.setSelected = function() {
        var that = this
            , options = that.config
            , data = options.data
            , $elem = $(options.elem)
            , $elemAcx = $elem.parent().parent();
        var items = $elemAcx.find('dd.layui-dd-selected');
        var v = $(items).html();
        $elem.val(v);
    };
    Class.prototype.events = function() {
        var that = this
            , options = that.config
            , data = options.data
            , $elem = $(options.elem)
            , $elemAcx = $elem.parent().parent();

        $elem.on('click', function(e) {
            //隐藏其他实例显示的弹层
            $('.layui-autocompleteX').not(options.elem).removeClass('layui-form-selected');

            if ($elemAcx.is('.layui-form-selected')) {
                $elemAcx.removeClass('layui-form-selected');
                $(document).off('click', mEvent);
            } else {
                $elemAcx.addClass('layui-form-selected');
                $(document).on('click', mEvent = function(e) {
                    if (e.target.id !== options.elem && e.target.className !== 'layui-input') {
                        $elemAcx.removeClass('layui-form-selected');
                        $(document).off('click', mEvent);
                    }
                });
            }
        });

        $elem.on('input propertychange', function(e) {
            if ($elemAcx.is('.layui-form-selected')) {
                $elemAcx.removeClass('layui-form-selected');
                $(document).off('click', mEvent);
            }
        });

        $elemAcx.on('click', 'dd', function(e) {
            var _dd = $(this);
            _dd.siblings().removeClass('layui-dd-selected');
            _dd.addClass('layui-dd-selected');
            _dd.find('.layui-form-checkbox').addClass('layui-form-checked');
            e.stopPropagation();

            that.setSelected();

            if ($elemAcx.is('.layui-form-selected')) {
                $elemAcx.removeClass('layui-form-selected');
                $(document).off('click', mEvent);
            }
        });
    };

    // 输出模块
    autocompleteX.render = function(options) {
        var inst = new Class(options);
        return thisAutocompleteX.call(inst);
    };
    exports('autocompleteX', autocompleteX);
});